<style type="text/css">
    .header-title {
        font-size: 0.4rem;
        height: 1.085rem;
        font-family: 'Microsoft YaHei';
        font-weight: bold;
        background-color: red;
        color: white;
        letter-spacing: 0.05rem;
    }
    
    .gname-input {
        padding-left: 0.3rem;
        height: 1rem;
        margin-top: 0.1rem;
    }
    #gname {
        font-size: 0.34rem;
    }
    #name-btn {
        margin-top: 0.3rem;
        background-color: #f9342a;
        color: white;
        border-radius: 0.5rem;
        width: 3rem;
        
    }
</style>

<div class="bui-page bui-box-vertical">
    <header>
       <div class="bui-bar header-title" style="background-color: red;">
        <div class="bui-bar-left">
            <a class="bui-btn" onclick="bui.back();"><i class="icon-back"></i></a>
        </div>
        <div class="bui-bar-main" style="font-size: 0.4rem">群聊名称</div>
        <div class="bui-bar-right">
            <!-- 右边按钮 -->
        </div>
       </div>
    </header>
    <main class="name-main">
        <div class="bui-input gname-input">
            <input id="gname" type="text" placeholder="">
        </div>
        <div id="name-btn" class="bui-btn">确认</div>
    </main>
    <footer>
        <!-- 底部内容 -->
    </footer>
</div>